@charset "utf-8";
/**
 * @file
 * @desc 全局公用样式
 */
.left {
    float: left;
}
.right {
    float: right;
}
.clearfix::after {
    content: '';
    display: block;
    clear: both;
}
.li,
ul li,
ol,
li {
    list-style: none;
}
.ablock {
    display: block;
    width: 100%;
    height: 100%;
}

.clo0,a.clo0{color:#000}
.clo3,a.clo3{color:#333}
.clo6,a.clo6{color:#666}
.clo9,a.clo9{color:#999}
.cloc,a.cloc{color:#ccc}
.dred,a.dred{color:#900}
.purple,a.purple{color:#691BA3}
/**
 * @color
 * @desc 统一状态颜色
 *  color: #090; 成功/正常
 *  color: #f90; 警告
 *  color: #E22; 失败/删除
 *  color: #39C; 链接查看
 */

$succeed:#67c23a;
$warn:#e6a23c;
$fail:#f00000;
$blue:#409eff;
$info:#d8d8d8;
$gray:#e6e8eb;
$purple:#691ba3;
$orange:#ff6600;
$white:#fffff;
.normal,.green,
.succeed {
    color: $succeed !important;
}
.warn {
    color: $warn !important;
}
.fail {
    color: $fail !important;
}
.look_a, .blue {
    color: $blue !important;
}
.info {
    color:$info !important;
}
.gray {
    color:$gray !important;
}
.elgray{
    color: #606266 !important;
}
.purple {
    color:$purple !important;
}
.orange,.org {
    color:var(--el-color-primary) !important;
    //color:$orange !important;
}
.white {
    color:$white !important;
}
.sc-black{
    color: #000000;
}

/**
常用深色设置
*/
$color: red blue yellow green black orange gray skyblue white;
@each $co in $color {
    .sc-#{$co} {
        color: $co !important;
    }
}
.sc-black{
    color: #000000;
}
.sc-yellow {
    color: #f60;
}
.sc-orange {
    color: #f90;
}
.sc-blue {
    color: #409eff !important;
}
.sc-green {
    color: #67c23a !important;
}
.sc-red {
    color: #f56c6c !important;
}
.sc-purple {
    color: #691BA3 !important;
}

.el-link {
    &.sc-blue:hover:after {
        border-bottom: 1px solid #409eff;
    }
}

$radius: 1 2 3 4 5 6 7 8 9 10;
@each $ra in $radius {
    .radius-#{$ra} {
        border-radius: $ra + px !important;
        -webkit-border-radius: $ra + px !important;
        -moz-border-radius: $ra + px !important;
        -ms-border-radius: $ra + px !important;
        -o-border-radius: $ra + px !important;
    }
}
/**
 * 内外边距
 * @example 上外边距为20px(约为10px): mt-10
 *          右内边距为30px(约为15px): pr-15
 */
$distance: 0 5 10 15 20 25 30 35 40 45 50 60 70;
@each $size in $distance {
    .margin-#{$size} {
        margin: $size + px;
    }
    .mt-#{$size} {
        margin-top: $size + px;
    }
    .mr-#{$size} {
        margin-right: $size + px;
    }
    .mb-#{$size} {
        margin-bottom: $size + px;
    }
    .ml-#{$size} {
        margin-left: $size + px;
    }
    .padding-#{$size} {
        padding: $size + px;
    }
    .pt-#{$size} {
        padding-top: $size + px;
    }
    .pr-#{$size} {
        padding-right: $size + px;
    }
    .pb-#{$size} {
        padding-bottom: $size + px;
    }
    .pl-#{$size} {
        padding-left: $size + px;
    }
}
.box-sizing{
    box-sizing: border-box;
}
/**
 * 字体大小
 * @example 字体大小为 24px(约为12px): font-12
 */
$fontSize: 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24;
@each $size in $fontSize {
    .font-#{$size} {
        font-size: $size + px;
    }
}
$op: 0 1 2 3 4 5 6 7 8 9;
@each $o in $op {
    .op-0#{$o} {
        opacity: $o/10;
    }
}
.op-10 {
    opacity: 1;
}

.fontb,
.font-weight,
.font-b {
    font-weight: bold;
}
/**
 * 字体行高
 * @example 行高为 1.5em: lineH-15
 */
$lineH: 1 1.2 1.5 1.8 2.3 2.8;
@each $height in $lineH {
    .lineH-#{$height*10} {
        line-height: $height;
    }
}
$lh: 5 10 15 20 25 30 35 40 45 50 55 60 65 70 75 80 85 90 95 100;
@each $h in $lh {
    .lineH-#{$h} {
        line-height: $h + px;
    }
}
/**
 * 设置宽度
 * @example 宽度为 100px: w100
 */
$wid:10 20 50 55 60 70 80 100 110 120 130 140 150 160 170 180 190 200 210 220 230 240 250 260 300 350 400 450;
@each $w in $wid {
    .w#{$w} {
        width: $w + px;
    }
}

/**
 * 偏移
 * @example x轴偏移20px: slatex-10
 *          y轴偏移30px: slatey-15
 */
$slate: 1 2 3 4 5 10 15 20 25 30 40;
@each $size in $slate {
    .slate-#{$size} {
        transform: translate($size + px);
    }
    .slatex-#{$size} {
        transform: translateX($size + px);
    }
    .slatey-#{$size} {
        transform: translateY($size + px);
    }
}

.w-50 {
    width: 12.5rem;
}
.w-25 {
    width: 6rem;
}

.sc-left {
    text-align: left !important;
}
.sc-center {
    text-align: center !important;
}
.sc-right {
    text-align: right !important;
}

/* 灰色背景 */
.page-gray {
    box-sizing: border-box;
    overflow-y: auto;
    min-width: 100vw;
    min-height: 100vh;
    background: #f3f3f3;
}

/* 按钮按下效果 */
.active-t,.acitve_t {
    cursor: pointer;
    &:active {
        transform: translateY(1px);
        opacity: 0.7;
    }
}

/* 文本一行 */
.text-oneline {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* 按钮去掉默认边框 */
.btn-noborder {
    &::after {
        border: none;
    }
}

/* loading page 图标 */
.u-loading-page__warpper__loading-icon {
    margin-bottom: 40px !important;
    &__img {
        width: 160px !important;
        height: 160px !important;
    }
}

/* upload 上传组件默认边距 */
.u-upload__button {
    margin: 0 !important;
}
.ld_center {
    text-align: center;
}
.flex {
    display: flex;
}
.flex-1{
    flex: 1;
}
.flex-grow-1{
    flex-grow: 1;
}
.flex-around {
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.flex-between {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.space-between{
    justify-content: space-between;
}
.flex-end{
    justify-content: flex-end;
}
.flex-start{
    justify-content: flex-start;
}
.fixed-mid{
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.col {
    flex-direction: column;
}
.row {
    flex-direction: row;
}
.el-message {
    --el-message-min-width: none;
    z-index: 999999!important;
}

.announcement {
    width: 100%;
}

.head-text{
    padding:10px;
    background-color:#dddddd82
}
/**
  查看图片样式调整
*/
.viewer-footer {
    bottom: 80px !important;
}

.viewer-toolbar > ul > li {
    width: 40px !important;
    height: 40px !important;
    margin: 0 10px !important;
}
.viewer-toolbar > ul > li::before {
    margin: 11px !important;
    transform: scale(1.3) !important;
    -webkit-transform: scale(1.3) !important;
    -moz-transform: scale(1.3) !important;
    -ms-transform: scale(1.3) !important;
    -o-transform: scale(1.3) !important;
}
.viewer-title {
    margin-bottom: 10px;
    overflow: none !important;
    font-size: 13px !important;
}
.pointer {
    cursor: pointer;
}

/** 主题表格布局相关 **/

.el-input input[type=number] {
    text-align: center;
}
.numLeft {
    :deep(.el-input__inner){
        text-align: left !important;
    }
}
.cancel-shadow{ //取消input 边框
    :deep(.el-input__wrapper){
        box-shadow: none;
    }
}

.sc-header {
    padding: 13px 15px;
    display: block;
    --el-header-max-height: 60px;
    --el-header-height: none;
}
.sc-container {
    padding: 18px;
}

.w100p {
    width: 100%;
}
.center {
    text-align: center;
}
.db {
    display: block;
}
.dib {
    display: inline-block;
}
.none {
    display: none;
}
.input-out-bor-none{
    border: none;
    outline: none;
}
.bord {
    border: 1px solid #ccc;
}
.bord-t{
    border-top: 1px solid #EEEEEE;
}
.bord-b{
    border-bottom: 1px solid #EEEEEE;
}
.bord-l{
    border-left: 1px solid #EEEEEE;
}
.bord-r{
    border-right: 1px solid #EEEEEE;
}
.ver-mid {
    vertical-align: middle;
}
.ver-top {
    vertical-align: top;
}
.ver-bom {
    vertical-align: bottom;
}
// 弹性盒子布局
.flex{
    display: flex;
}
.grid{
    display: grid;
}
.align-center{
    align-items: center;
    align-content: center;
}
.ellipsis{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.relative{
    position: relative;
}
.absolute{
    position: absolute;
}

//自定义 多选样式
.check-box {
    box-shadow: 0px 3px 12px 1px rgba(14, 95, 149, 0.07);
    border-radius: 4px 4px 4px 4px;
    border: 1px solid #f2f2f2;
    padding: 5px;
    display: inline-block;
    cursor: pointer;
}
.check-primary {
    border: 1px solid #ff9d6f;
    background-color: #fcf5f2;
    color: #3f3f3f;
}
.user-select-none{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.el-header .el-form--inline,.sc-header .el-form--inline  {
    .el-form-item--default,.el-form-item{
        margin-bottom: 5px !important;
    }
}